<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		
	</head>

	<body>
		<ul class="mui-table-view" id="chat-snapshot-list">
			
		</ul>
		
		<script src="js/mui.js"></script>
		<script src="js/app.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/sqlite.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init();
			
			var ele_chat_snapshot_list = document.getElementById('chat-snapshot-list');
			mui('#chat-snapshot-list').on('tap', '.mui-table-view-cell', function () {
				mui.openWindow({
					url: "chatting.html",
					extras: {
						friendUserId: parseInt(this.getAttribute("friendId"))
					}
				});
			});
			
			function loadChatSnapshot() {
				var me = app.getGlobalUserInfo();
				var chatSnapshotList = app.getSnapshortList(me.id);
				
				var chatSnapshotHtml = "";
				for (var i = 0; i < chatSnapshotList.length; i++) {
					var friend = app.getFriendItem(chatSnapshotList[i].friendId);
					chatSnapshotHtml +=
						'<li class="mui-table-view-cell mui-media" friendId="' + friend.id + '">' +
							'<a href="javascript:;">' +
								'<img class="mui-media-object mui-pull-left" src="' + app.getFaceImage(friend.id) + '" style="border-radius: 5px;">' +
								'<div class="mui-media-body">' +
									friend.name +
									'<p class="mui-ellipsis">' + chatSnapshotList[i].msg + '</p>' +
								'</div>' +
							'</a>' +
						'</li>';
				}
				
				ele_chat_snapshot_list.innerHTML = chatSnapshotHtml;
			}
			
			mui.plusReady(function () {
				var me = app.getGlobalUserInfo();
			    window.CHAT = {
			    	socket: null,
			    	init: function () {
						if (CHAT.socket != null
							&& CHAT.socket != undefined
							&& CHAT.socket.readyState == CHAT.socket.OPEN) {
							console.log("Websocket is ready...");
							return;
						}
						
			    		if (window.WebSocket) {
			    			CHAT.socket = new window.WebSocket(app.nettyServerAddress);
			    			CHAT.socket.onopen = CHAT.wsopen;
			    			CHAT.socket.onclose = CHAT.wsclose;
			    			CHAT.socket.onmessage = CHAT.wsmessage;
			    			CHAT.socket.onerror = CHAT.wserror;
			    		} else {
			    			alert("设备过于陈旧，请升级您的设备...");
			    		}
			    	},
					resend: function (msg) {
						console.log("重新发送消息");
						CHAT.socket.send(msg);
					},
			    	send: function (msg) {
						if (CHAT.socket != null
							&& CHAT.socket != undefined
							&& CHAT.socket.readyState == CHAT.socket.OPEN) {
							CHAT.socket.send(msg);
						} else {
							CHAT.init();
							setTimeout("CHAT.resend('" + msg + "')", 1000);
						}
						loadChatSnapshot();
			    	},
			    	wsopen: function () {
			    		console.log("websocket建立连接");
			    		var chatMsg = new app.ChatMsg(me.id, null, null, null);
			    		var dataContent = new app.DataContent(app.CONNECT, chatMsg, null);
			    		CHAT.send(JSON.stringify(dataContent));
			    	},
			    	wsclose: function () {
			    		console.log("websocket关闭连接");
			    	},
			    	wserror: function () {
			    		console.log("websocket发生错误");
			    	},
			    	wsmessage: function (e) {
			    		console.log("收到消息" + e.data);
						var dataContent = JSON.parse(e.data);
						var chattingWebView = plus.webview.getWebviewById("chatting.html");
						var isRead = false;
						if (chattingWebView != null) {
							chattingWebView.evalJS("appendRecvMessage('" + dataContent.chatMsg.msg + "')");
							isRead = true;
						}
						SQLITE.insertChatMsg(dataContent.chatMsg.senderId, dataContent.chatMsg.receiverId, dataContent.chatMsg.msg);
						app.saveChatSnapshot(me.id, dataContent.chatMsg.senderId, dataContent.chatMsg.msg, isRead);
						loadChatSnapshot();
			    	}
			    }
			    CHAT.init();
				loadChatSnapshot();
			});
		</script>
	</body>

</html>
